<template>
    <div>
        <el-card>
            <div slot="header" class="clearfix">
                <el-breadcrumb separator="/">
                    <el-breadcrumb-item>首页</el-breadcrumb-item>
                    <el-breadcrumb-item>产品管理</el-breadcrumb-item>
                    <el-breadcrumb-item>活期管理</el-breadcrumb-item>
                </el-breadcrumb>
            </div>
            <!-- 搜索 -->
            <div>
                <el-form :inline="true" class="demo-form-inline">
                    <el-form-item>
                        <el-input
                            v-model="searchData.name"
                            placeholder="请输入搜索内容"
                        ></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="getCurrentData"
                            >查询</el-button
                        >
                        <el-button
                            type="primary"
                            icon="el-icon-plus"
                            @click="addDialogShow = true"
                            >新增</el-button
                        >
                    </el-form-item>
                </el-form>
            </div>
            <!-- 表格 -->
            <el-table
                :data="currentData"
                border
                stripe
                style="width: 100%"
                height="65vh"
            >
                <el-table-column prop="code" label="基金代码" fixed>
                </el-table-column>
                <el-table-column prop="name" label="基金名" fixed width="200">
                </el-table-column>
                <el-table-column prop="type" label="基金类型" width="90">
                </el-table-column>
                <el-table-column
                    prop="lastMonthGrowth"
                    label="周单位净值涨幅"
                    width="120"
                >
                </el-table-column>
                <el-table-column prop="buyMin" label="起购额度">
                </el-table-column>
                <el-table-column prop="buySourceRate" label="当前买入费率">
                </el-table-column>
                <el-table-column prop="manager" label="基金经理">
                </el-table-column>
                <el-table-column prop="fundScale" label="基金规模">
                </el-table-column>
                <el-table-column
                    prop="sevenDaysYearIncome"
                    label="当前七日年化收益"
                >
                </el-table-column>
                <el-table-column
                    prop="status"
                    label="禁用账户"
                    align="center"
                    width="200"
                >
                    <template slot-scope="scope">
                        <el-switch
                            :value="scope.row.status == 1 ? '1' : '2'"
                            active-value="1"
                            inactive-value="2"
                            active-color="#13ce66"
                            inactive-color="#ff4949"
                            active-text="上架"
                            inactive-text="下架"
                            @change="updateStatus(scope.row.code,scope.row.status)"
                        >
                        </el-switch>
                    </template>
                </el-table-column>
                <el-table-column
                    prop="code"
                    label="操作"
                    fixed="right"
                    align="center"
                >
                    <template slot-scope="scope">
                        <el-button
                            type="danger"
                            size="mini"
                            icon="el-icon-delete"
                            @click="delOne(scope.row.code)"
                            >删除</el-button
                        >
                    </template>
                </el-table-column>
            </el-table>
            <!-- 分页 -->
            <el-pagination
                @current-change="handleCurrentChange"
                :current-page="searchData.page"
                :page-size="pageData.pageSize"
                layout="total, prev, pager, next, jumper"
                :total="pageData.total"
            >
            </el-pagination>
        </el-card>
        <!-- 新增弹框 -->
        <el-dialog title="新增学生" :visible.sync="addDialogShow">
            <addDialog></addDialog>
        </el-dialog>
    </div>
</template>

<script>
import addDialog from "../../../components/current/addDialog.vue";
export default {
    data() {
        return {
            searchData: {
                name: "",
                page: 1,
            },
            pageData: {
                pageSize: 10,
                total: 0,
            },
            currentData: [],
            addDialogShow: false,
        };
    },
    components: {
        addDialog,
    },
    mounted() {
        this.getCurrentData();
    },
    computed: {
        upShow() {
            return true;
        },
    },
    methods: {
        // 获取活期数据
        async getCurrentData() {
            const res = await this.$http.current.getCurrentData(
                this.searchData
            );
            console.log(res);
            if (res.code === 200) {
                this.currentData = res.data.list;
                this.pageData.pageSize = res.data.pageSize;
                this.pageData.total = res.data.total;
            }
        },
        // 切换页数
        handleCurrentChange(val) {
            this.searchData.page = val;
            this.getCurrentData();
        },
        // 删除数据
        async delOne(code) {
            // let codes =[];
            // codes.push(code);
            // console.log(codes);
            const res = await this.$http.current.delCurrentData({
                codes: [code],
                status: 3,
            });
            console.log(res);
            if (res.code == 200) {
                this.$message({
                    message: "删除成功",
                    type: "success",
                });
                this.getCurrentData();
            } else {
                this.$message.error("删除失败");
            }
        },
        // 修改status 状态
        async updateStatus(code,status) {
            status == 1 ? status = 2 : status = 1
            console.log(status);
            console.log(code);
            const res = await this.$http.current.delCurrentData({
                codes: [code],
                status
            });
            console.log(res);
            this.getCurrentData();
        },
    },
};
</script>

<style scope>
.el-pagination {
    text-align: center;
    margin-top: 16px;
}
</style>